# ============================================
# 知识点
# ============================================
# 样式操作
# --------------------------------------------
# 操作类标签
# addClass()
# removeClass ()
# hasClass()
# toggleClass()
# --------------------------------------------
# # css操作
# <p>111</p>
# <p>222</p>
# “““-行代码将第一个p标签变成红色第二个p标签变成绿色"""
# $('p').first().css( 'color', 'red' ).next() .css( 'color'，'green')
# # jQuery的链式操作使用jQuery 可以做到一行代码操作很多标签
# # jQuery对象调用 jQuery方法之后返回的还是jQuery对象 也就可以继续调用
class MyClass( object):
    def func1(self) :
        print( ' func1')
        return self

    def func2(self) :
        print( ' func2')
        return self 
obj = MyClass( )
obj. func1( ). func2( )
# --------------------------------------------
#位置操作
# offset() # 相对于浏览器窗口
# position() # 相对于父标签

# scrollTop( )
# #需要了解
# $ (window) .scrollTop( )
# 0
# $ (window) . scrol1Top( )
# 969
# $ (window) . scrollTop() # 括号内不加参数就是获取
# 1733
# $ (window) . scrol1Top(0) # 加了参数就是设置
# n. fn. init [ Window ]
# $ (window). scrol1Top(500)
# n. fn. init [ Window ]

# scrollLeft( )
# --------------------------------------------
#尺寸
# $('p').height() #文本
# 20
# $('p').width()
# 1670
# $('p'). innerHeight() # 文本+padding
# 26
# $('p'). innerWidth()
# 1674
# $('p'). outerHeight() # 文本+padding+border
# 26
# $('p' ) .outerWidth( )
# 1674
# ============================================
# 属性操作
# --------------------------------------------
# 文本操作
# text() 获取标签文本
# html() 获取标签文本加内标签
# 括号加入参数就是改参数
# --------------------------------------------
#获取值操作
# jQuery
# .val( )
# $('#d1').val()
# " sasdasdsads adad"
# $( '#d1' ).val('520快乐') # 括号内不加参数就是获取加了就是设置
# w. fn. init [ input#d1 ]

# $('#d2').val()
# "C:\fakepath\01_测试路由. png"
# $( '#d2')[0].files[0] # 牢记两个对象之间的转换
# --------------------------------------------
# 属性操作
# jQuery
# attr (name, value)
# attr (name )
# removeAttr ( name )
# 在用变量存储对象的时候js中推荐使用
# XXXEle
# 标签对象
# jQuery中推荐使用
# $XXXEle

# jQuery对象
# let $pEle = $('p')
# undefined
# $pEle.attr('id')
# "d1"
# SpEle.attr( 'class')
# undef ined
# $pEle.attr('class','c1')   赋值操作
# w. fn.init [p#d1.c1, prevobject: w.fn.init(1)]
# $pEle.attr('id', ' id666' )
# w. fn.init [p#id666.c1， prevobject: w.fn.init(1)]
# $pEle . attr(' password', 'jason123')
# w. fn. init [p#id666.c1， prevobject: w. fn.init(1) ]
# $pEle. removeAttr( ' password' )
# w. fn. init [p#id666.c1， prevobject: w. fn.init(1)]

# 对于标签上有的能够看到的属性和自定义属性用attr
# 对于返回布尔值比如checkibox radio option是 否被选中用prop  
# $( '#d2' ) . prop( ' checked' )
# false
# $( ' #d2' ). prop( ' checked' )
# true
# $( ' #d3' ). prop( ' checked'，true)
# w. fn. init [ input#d3 ]
# $( ' #d3' ). prop( ' checked'，false)
# w. fn. init [ input#d3 ]
# --------------------------------------------
# 文档处理
# jQuery
# $('<p>')  创建
# append( )  添加

# let $pEle = $('<p>')
# SpEle. text( '你好啊草莓要不要来几个?')
# $pEle.attr('id','d1')
# $( ' #d1' ). append($pEle) # 内部尾部追加
# SpEle . appendTo($( ' #d1' ))

# $(' #d1' ). prepend($pE1e) # 内部头部追加
# w. fn. init [ div#d1 ]
# SpEle. prependTo($( ' #d1'))
# w. fn. init [p#d1， prevobject: w. fn. init(1)]

# $( '#d2' ) . after( $pEle)   #放在标签后面
# w. fn. init [ p#d2 ]
# $pEle. insertAfter($( '#d1'))

# $( '#d1' ) .before($pEle)  #放在标签前面
# W. fn. init [ div#d1 ]
# $pEle. insertBefore($( '#d2') )

# $( ' #d1' ). remove() #将标签从DOM树中删除
# w. fn. init [ div#d1 ]

# $( '#d1').empty()_ # 清空标签内部所有的内容
# w. fn. init [div#c1 ]
# --------------------------------------------